/*
 * @Author: 徐建辰
 * @Date: 2021-11-03 16:31:06
 * @LastEditTime: 2021-11-04 08:51:38
 * @LastEditors: Please set LastEditors
 * @Description: 首页头部始发站、终点站切换
 */
import React from 'react'
import './journey.css'
import switchImg from '@/assets/switch.svg'

export default function Journey(props) {
  const {from, to, exchangeFromTo, showCitySelector} = props
  return (
    <div className="journey">
      {/* true代表回填到左边，false则是右边 */}
      <div className="journey-station" onClick={() => showCitySelector(true)}>
        <input type="text" readOnly name="from" value={from} className="journey-input journey-from" />
      </div>
      <div className="journey-switch" onClick={() => exchangeFromTo()}>
          <img src={switchImg} width="70" height="40" alt="切换" />
      </div>
      <div className="journey-station" onClick={() => showCitySelector(false)}>
        <input type="text" readOnly name="to" value={to} className="journey-input journey-to" />
      </div>
    </div>
  )
}
